<template>
  <section class="webview fixHeight">
    <el-scrollbar style="height:100%">
      <div class="search">
        <div class="content">
          <div class="part1">
            <div class="item">
              <span class="name">关键字</span>
              <el-input
                v-model="detail.title"
                class="input margin-left"
                placeholder="关键字"
                maxlength="20"
                @keyup.enter.native="search"
              />
            </div>
<!--            <div class="item">-->
<!--              <span class="name">房屋类型</span>-->
<!--              <el-select v-model="detail.newOrSecond" class="input margin-left" placeholder="请选择">-->
<!--                <el-option-->
<!--                  v-for="item in typeOptions"-->
<!--                  :key="item.value"-->
<!--                  :label="item.label"-->
<!--                  :value="item.value"-->
<!--                />-->
<!--              </el-select>-->
<!--            </div>-->
            <div class="searchItem">
              <el-button type="success" round class="search-btn" @click="getList">搜索</el-button>
            </div>
          </div>
        </div>
      </div>
      <div class="table margin-top padding-bottom">
        <el-table
          ref="multipleTable"
          empty-text="暂无数据"
          :data="list"
          style="width: 100%"
          :row-style="{background: '#FCFDFF'}"
          :header-cell-style="{background:'#46705D',color:'#ffffff'}"
          @select-all="handleSelectAll"
          @selection-change="handleSelectionChange"
        >
          <el-table-column
            type="selection"
            width="55"
          />
          <el-table-column fixed type="index" label="序号" :show-overflow-tooltip="true" align="center" />
         
          <el-table-column label="标题" :show-overflow-tooltip="true" align="center">
            <template slot-scope="scope">
              <div>{{ scope.row.title }}</div>
            </template>
          </el-table-column>
          <el-table-column label="发布人" :show-overflow-tooltip="true" align="center">
            <template slot-scope="scope">
              <div>{{ scope.row.userName }}</div>
            </template>
          </el-table-column>
          <el-table-column label="性别" :show-overflow-tooltip="true" align="center">
            <template slot-scope="scope">
              <div>{{ scope.row.chumSex }}</div>
            </template>
          </el-table-column>
          <el-table-column label="状态" :show-overflow-tooltip="true" align="center">
            <template slot-scope="scope">
              <div>{{ scope.row.type}}</div>
            </template>
          </el-table-column>
		  <el-table-column label="租金" :show-overflow-tooltip="true" align="center">
		    <template slot-scope="scope">
		      <div>{{ scope.row.monthlyRent }}</div>
		    </template>
		  </el-table-column>
		  <el-table-column label="发表时间" :show-overflow-tooltip="true" align="center">
		    <template slot-scope="scope">
		      <div>{{  scope.row.createAt }}</div>
		    </template>
		  </el-table-column>
		  
          <el-table-column fixed="right" label="操作" :show-overflow-tooltip="true" align="center" width="250">
            <template slot-scope="scope">
              <el-button type="text" size="small"  @click="toSee(scope.row.id)">查看</el-button>
              <el-button type="text" size="small"  @click="toDel(scope.row.id)">删除</el-button>
             
            </template>
          </el-table-column>
        </el-table>
        <div class="pageContain margin-top">
          <div style="flex: 1;text-align: right;">共{{pagination.total}}条</div>
          <el-pagination
            :current-page="pagination.page"
            :page-size="pagination.pageSize"
            :background="true"
            layout="prev, pager, next"
            :total="pagination.total"
            @current-change="handleCurrentChange"
          />
        </div>
      </div>
    </el-scrollbar>
  </section>
</template>
<script>
import { getLookChumList,agentDelete,agentUpdateStatus,deleteUcUserLookChumDetail } from '@/api/api'
export default {
  data() {
    return {
      list: [],
      pagination: {
        pageSize: 10,
        page: 1,
        total: 0
      },
      detail: {
        title: '',
        templateType: ''
      },
      ids: []
    }
  },
  created() {
    this.getList()
  },
  methods: {
	  // 单选删除
	  toDel(id) {
	    this.$confirm('确认删除？', '提示', {
	      confirmButtonText: '确定',
	      cancelButtonText: '取消',
	      type: 'warning'
	    }).then(() => {
	      deleteUcUserLookChumDetail(
	        {id:id}
	      ).then(data => {
	        Is.tip('删除成功', 1500, 'success')
	        if (this.list.length === 1 && this.pagination.page > 1) {
	          this.pagination.page--
	        }
	        this.getList()
	      })
	    }).catch((e) => {
	  
	    })
	  },
 //    toDel(id){
		
	// 	().then(data => {	
	// 			 Is.tip('编辑成功', 2000, 'success');
	// 			 this.getList()
	// 	})
	// },
    toSee(item) {
      this.$router.push({ path: '/roommate/see', query: { data: item }})
    },
   
   
    reset() {
      this.detail = {
        title: ''
      }
      this.pagination = {
        pageSize: 10,
        page: 1,
        total: 0
      }
      this.getList()
    },
    getList() {
      const params = {
        curPage: this.pagination.page,
        pageSize: this.pagination.pageSize,
		name:this.detail.title
      }
      getLookChumList(params).then(data => {
		  this.list = data.data.records
		  this.pagination.total = data.data.total
		  
		for(var i=0;i<data.data.records.length;i++){
			switch (data.data.records[i].chumSex) {
			 
			  case 1:
			     this.list[i].chumSex = '男女不限'
			    break
			  case 2:
			     this.list[i].chumSex = '限女生'
			    break
			  case 3:
			     this.list[i].chumSex = '限男生'
			    break
			}
		};
		for(var i=0;i<data.data.records.length;i++){
			switch (data.data.records[i].type) {
			 
			  case 1:
			     this.list[i].type = '无房找室友'
			    break
			  case 2:
			     this.list[i].type = '有房找室友'
			    break
			}
		};
		
      })
    },
    handleSelectAll(selection) {
      this.ids = []
      if (selection.length > 0) {
        selection.forEach(item => {
          this.ids.push(item.id)
        })
      }
    },
    handleCurrentChange(val) {
      // 重置当前页码
      this.pagination.page = val
      this.getList()
    },
    handleSelectionChange(selection) {
      this.ids = []
      if (selection.length > 0) {
        selection.forEach(item => {
          this.ids.push(item.id)
        })
      }
    }
  }}
</script>
